import React, { FC, useState } from 'react'

const StateDemo: FC = () => {
  /* const [userInfo, setUserInfo] = useState({ name: '李子一', age: 20 })

  function changeAge() {
    console.log(userInfo)
    // 不可变数据，不去修改 state 的值，而是传入一个新的值
    setUserInfo({ name: '李子一', age: userInfo.age + 1 })
  } */

  const [list, setList] = useState(['x', 'y'])
  function addItem() {
    // setList([...list, 'z'])
    setList([...list.slice(), '1'])
  }
  return (
    <>
      {/* <div>{JSON.stringify(userInfo)}</div>
      <button onClick={changeAge}>change age</button> */}
      <div>{JSON.stringify(list)}</div>
      <button onClick={addItem}>add item</button>
    </>
  )
}

export default StateDemo
